<template>
  <div class="siteBox">
        <search ref="search"></search>
        <flexbox class="topBox">
            <flexbox-item >
                <div class="flex-demo" >
                    <popup-picker  :data="list1" v-model="value1"  placeholder="江苏" value-text-align="center" @on-hide="onHide"></popup-picker>
                </div>
            </flexbox-item>
            <flexbox-item>
                <div class="flex-demo">
                    <popup-picker  :data="list1" v-model="value2"  placeholder="南京" value-text-align="center" @on-hide="onHide1"></popup-picker>                    
                </div>
            </flexbox-item>
            <flexbox-item>
                <div class="flex-demo " >
                    <popup-picker  :data="list1" v-model="value3"  placeholder="九龙湖站点111111" value-text-align="center" @on-hide="onHide2"></popup-picker>                                        
                </div>
            </flexbox-item>
        </flexbox>
         <group  class="siteList">
            <ul>
                <li v-for="(item,$index) in radio001"  @click="showPlugin($index)">
                    <p  class="one">{{item.title}}</p>
                    <p class="two">{{item.value}}</p>
                </li>
            </ul>
        </group>
     
        
  </div>
</template>
<script>
    import { Search, Group, Cell, XButton,Grid,GridItem,GroupTitle,Icon,Flexbox ,FlexboxItem,Divider,PopupPicker,Radio,Confirm} from 'vux'
    export default {
        data(){
            return {
                 list1: [['小米', 'iPhone', '华为', '情怀', '三星', '其他', '不告诉你']],
                 value1:[],
                 value2:[],
                 value3:[],
                 value:'',
                 radio001: [
                     {
                        title:'熊猫快恒大家园',
                        value: '巢湖一中北门斜对面向东50米巢湖一中北门斜对面中北门 向东50米'
                    }, 
                     {
                        title:'熊猫快恒大家园1',
                        value: '巢湖一中北门斜对面向东50米巢湖一中北门斜对面中北门 向东50米1'
                    }, 
                    {
                        title:'熊猫快恒大家园1',
                        value: '巢湖一中北门斜对面向东50米巢湖一中北门斜对面中北门 向东50米1'
                    }, 
                    {
                        title:'熊猫快恒大家园1',
                        value: '巢湖一中北门斜对面向东50米巢湖一中北门斜对面中北门 向东50米1'
                    }, 
                    {
                        title:'熊猫快恒大家园1',
                        value: '巢湖一中北门斜对面向东50米巢湖一中北门斜对面中北门 向东50米1'
                    }, 
                ], 
            }
        },
        methods:{
             showPlugin ($index) {
                 var _this = this;
                this.$vux.confirm.show({
                    title: 'Title',
                    content: 'Content',
                    onShow () {
                    console.log('plugin show')
                    },
                    onCancel () {
                    console.log('plugin cancel')
                    },
                    onConfirm () {
                        var _data = _this.radio001[$index].title
                        console.log(_data)
                        _this.$router.go(-1)
                    }
                })
            },
            onHide(){
                console.log('关闭piker')
            },
            onHide1(){
                console.log('关闭piker1')   
            },
            onHide2(){
                console.log('关闭piker2')   
            }
        },
        components:{
            Search,
            Group,
            Cell,
            XButton,
            Grid,
            GridItem,
            GroupTitle,
            Icon,
            Flexbox,
            FlexboxItem,
            Divider,
            PopupPicker,
            Radio,
            Confirm
        }
    }
</script>
<style>

</style>
